<template>
  <div>
    <div class="admin-renyuan">
      <div class="admin-renyuan-case">
        <div ref="contraTop" class="admin-top">
          <div class="admin-case-top">
            <div style="font-size: 14px; color: #333333">部门标记</div>
            <el-select
              style="width: 200px; margin-left: 8px"
              v-model="form.vbmbj"
              placeholder="请选择所属部门"
            >
              <el-option
                v-for="(item, i) in vbmbjArr"
                :key="i"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select>
          </div>
          <div class="admin-case-top">
            <div style="font-size: 14px; color: #333333">使用状态</div>
            <el-select
              style="width: 200px; margin-left: 8px"
              v-model="form.vsyzt"
              placeholder="请选择人员类别"
            >
              <el-option label="正常" value="1"></el-option>
              <el-option label="停用" value="2"></el-option>
              <el-option label="申请中" value="3"></el-option>
            </el-select>
          </div>
          <div class="admin-case-top">
            <div style="font-size: 14px; color: #333333">名称</div>
            <el-input
              style="width: 200px; margin-left: 8px"
              v-model="form.vbmmc"
              placeholder="请输入"
            ></el-input>
          </div>
          <el-button
            type="primary"
            :icon="Search"
            @click="searchClick"
            style="width: 72px"
            >查询</el-button
          >
        </div>
        <div class="line"></div>
        <div class="xinban-pai">
          <div
            class="xinban-pai-left"
            :class="{ 'xinban-pai-left-active': detailShow }"
          >
            <div class="button-case">
              <div @click="addData" class="button-case-box">
                <img
                  src="../../../assets/images/add_icon.png"
                  style="width: 16px; height: 16px; margin-right: 2px"
                  alt=""
                  srcset=""
                />
                <div>新增</div>
              </div>
              <div @click="deleteClick" class="button-case-box">
                <img
                  src="../../../assets/images/del_icon.png"
                  style="width: 16px; height: 16px; margin-right: 2px"
                  alt=""
                  srcset=""
                />
                <div>删除</div>
              </div>
              <div @click="saveClick" class="button-case-box">
                <img
                  src="../../../assets/images/save_icon.png"
                  style="width: 16px; height: 16px; margin-right: 2px"
                  alt=""
                  srcset=""
                />
                <div>保存</div>
              </div>
              <div class="button-case-box">
                <img
                  src="../../../assets/images/der_icon.png"
                  style="width: 16px; height: 16px; margin-right: 2px"
                  alt=""
                  srcset=""
                />
                <div>导出</div>
              </div>
              <div class="button-case-box" @click="detailClick">
                <img
                  src="../../../assets/images/bangding_icon.png"
                  style="width: 16px; height: 16px; margin-right: 2px"
                  alt=""
                  srcset=""
                />
                <div>详情</div>
              </div>
            </div>
            <!-- 表格 -->
            <xinpuTableGrid
              ref="xinpuGrid"
              :loading="loading"
              :tableHeight="tableHeight"
              :tableWidth="tableWidth"
              :columnsData="columns"
              :data="data"
              :border="true"
              @updataSelect="updataSelect"
              @selectCheckedChange="selectCheckedChange"
              @vxeActiveClick="vxeActiveClick"
            >
            </xinpuTableGrid>
          </div>
          <div class="resize">
            <img
              src="../../../assets/images/huadong_icon.png"
              style="width: 100%; height: 12px"
              alt=""
              srcset=""
            />
          </div>
          <div class="xinban-pai-right" v-show="detailShow">
            <div class="admin-Drawer-top">
              <div>便民门诊</div>
              <el-icon size="18px" @click="detailShowCloseClick"
                ><Close
              /></el-icon>
            </div>
            <div class="admin-Drawer-bottoms">
              <div class="admin-Drawer-bottoms-tab">
                <div
                  class="admin-Drawer-bottoms-tab-case"
                  :class="{ 'tabs-active': tsbsActive == i }"
                  v-for="(item, i) in tabsArr"
                  @click="tabsClick(i)"
                  :key="i"
                >
                  {{ item }}
                </div>
              </div>
              <div class="admin-Drawer-bottoms-btn">
                <div @click="detailSaveClick" class="button-case-box">
                  <img
                    src="../../../assets/images/save_icon.png"
                    style="width: 16px; height: 16px; margin-right: 2px"
                    alt=""
                    srcset=""
                  />
                  <div>保存</div>
                </div>
                <div @click="detailShowCloseClick" class="button-case-box">
                  <img
                    src="../../../assets/images/can_icon.png"
                    style="width: 16px; height: 16px; margin-right: 2px"
                    alt=""
                    srcset=""
                  />
                  <div>取消</div>
                </div>
              </div>
              <div class="content-tabs container" ref="container">
                <div
                  class="content-info"
                  v-show="tsbsActive !== 2"
                  id="infos"
                  ref="infos"
                >
                  <div class="content-info-top">
                    <div class="content-line"></div>
                    <div>基本信息</div>
                  </div>
                  <div class="content-info-center-cell">
                    <div class="content-info-center-case">
                      <div class="content-info-center-case-lable">部门编码</div>
                      <el-input
                        v-model="addform.bh"
                        style="width: 200px"
                        placeholder="请输入"
                      ></el-input>
                    </div>
                    <div class="content-info-center-case">
                      <div class="content-info-center-case-lable">部门名称</div>
                      <el-input
                        v-model="addform.mc"
                        style="width: 200px"
                        placeholder="请输入"
                      ></el-input>
                    </div>
                    <div class="content-info-center-case">
                      <div class="content-info-center-case-lable">部门标记</div>
                      <el-select
                        style="width: 200px"
                        v-model="addform.bj"
                        placeholder="请选择"
                      >
                        <el-option
                          v-for="(item, i) in vbmbjArr"
                          :key="i"
                          :label="item.label"
                          :value="item.value"
                        ></el-option>
                      </el-select>
                    </div>
                    <div class="content-info-center-case">
                      <div class="content-info-center-case-lable">简码</div>
                      <el-input
                        v-model="addform.zxbmbm_pyjm"
                        style="width: 200px"
                        placeholder="请输入"
                      ></el-input>
                    </div>
                    <div class="content-info-center-case">
                      <div class="content-info-center-case-lable">HIS编号</div>
                      <el-input
                        v-model="addform.Newbh"
                        style="width: 200px"
                        placeholder="请输入"
                      ></el-input>
                    </div>
                    <div class="content-info-center-case">
                      <div class="content-info-center-case-lable">科室病区</div>
                      <el-select
                        style="width: 200px"
                        v-model="addform.yke414"
                        placeholder="请选择"
                      >
                        <el-option
                          v-for="(item, i) in columns[8].selectOption.data"
                          :key="i"
                          :label="item.label"
                          :value="item.value"
                        ></el-option>
                      </el-select>
                    </div>
                    <div class="content-info-center-case">
                      <div class="content-info-center-case-lable">负责人</div>
                      <el-input
                        v-model="addform.yke416"
                        style="width: 200px"
                        placeholder="请输入"
                      ></el-input>
                    </div>
                    <div class="content-info-center-case">
                      <div class="content-info-center-case-lable">成立日期</div>
                      <el-date-picker
                        style="width: 200px"
                        v-model="addform.ks_clrq"
                        type="date"
                        value-format="YYYY-MM-DD"
                        placeholder="选择日期时间"
                      >
                      </el-date-picker>
                    </div>
                    <div class="content-info-center-case">
                      <div class="content-info-center-case-lable">设备状态</div>
                      <div class="content-state">
                        <div
                          class="content-state-one"
                          :class="{
                            'content-state-active': addform.syzt == 1,
                          }"
                          @click="stateClick(1)"
                        >
                          正常
                        </div>
                        <div
                          class="content-state-two"
                          :class="{
                            'content-state-active': addform.syzt == 2,
                          }"
                          @click="stateClick(2)"
                        >
                          停用
                        </div>
                        <div
                          class="content-state-three"
                          :class="{
                            'content-state-active': addform.syzt == 3,
                          }"
                          @click="stateClick(3)"
                        >
                          申请中
                        </div>
                      </div>
                    </div>
                    <div class="content-info-center-case">
                      <div class="content-info-center-case-lable">总床位数</div>
                      <el-input
                        v-model="addform.yke417"
                        style="width: 200px"
                        placeholder="请输入"
                      ></el-input>
                    </div>
                    <div class="content-info-center-case">
                      <div class="content-info-center-case-lable">实际床位</div>
                      <el-input
                        v-model="addform.sjkfcws"
                        style="width: 200px"
                        placeholder="请输入"
                      ></el-input>
                    </div>
                    <div class="content-info-center-case">
                      <div class="content-info-center-case-lable">联系电话</div>
                      <el-input
                        v-model="addform.sjkfcws"
                        type="number"
                        style="width: 200px"
                        placeholder="请输入"
                      ></el-input>
                    </div>
                    <div class="content-info-center-case">
                      <div class="content-info-center-case-lable">开始日期</div>
                      <el-date-picker
                        style="width: 200px"
                        v-model="addform.sxkssj"
                        type="date"
                        value-format="yyyy-MM-dd"
                        placeholder="选择日期时间"
                      >
                      </el-date-picker>
                    </div>
                    <div class="content-info-center-case">
                      <div class="content-info-center-case-lable">结束日期</div>
                      <el-date-picker
                        style="width: 200px"
                        v-model="addform.sxjssj"
                        type="date"
                        value-format="yyyy-MM-dd"
                        placeholder="选择日期时间"
                      >
                      </el-date-picker>
                    </div>
                    <div
                      class="content-info-center-case"
                      style="align-items: center; flex: 0 0 50%"
                    >
                      <div
                        class="content-info-center-case-lable"
                        style="flex: 0 0 180px"
                      >
                        科室住院病人最高欠费金额
                      </div>
                      <el-input
                        v-model="addform.je"
                        type="number"
                        style="width: 200px"
                        placeholder="请输入"
                      >
                        <template #append>元</template>
                      </el-input>
                    </div>
                  </div>
                </div>

                <div
                  class="content-yibaoinfo"
                  v-show="tsbsActive !== 1"
                  id="yibaoinfos"
                  ref="yibaoinfos"
                >
                  <div class="content-yibaoinfo-top">
                    <div class="content-line"></div>
                    <div>扩展信息</div>
                  </div>
                  <div class="content-info-center-cell">
                    <div class="content-info-center-case">
                      <div
                        style="flex: 0 0 98px"
                        class="content-info-center-case-lable"
                      >
                        西医/中医病案
                      </div>
                      <el-select
                        style="width: 166px"
                        v-model="addform.zxy_sf"
                        placeholder="请选择"
                      >
                        <el-option
                          v-for="(item, i) in columns[14].selectOption.data"
                          :key="i"
                          :label="item.label"
                          :value="item.value"
                        ></el-option>
                      </el-select>
                    </div>
                    <div class="content-info-center-case">
                      <div
                        style="flex: 0 0 92px"
                        class="content-info-center-case-lable"
                      >
                        平台对照科室
                      </div>
                      <el-select
                        style="width: 172px"
                        v-model="addform.jnpt_bmbm"
                        placeholder="请选择"
                      >
                        <el-option
                          v-for="(item, i) in columns[22].selectOption.data"
                          :key="i"
                          :label="item.label"
                          :value="item.value"
                        ></el-option>
                      </el-select>
                    </div>
                    <div class="content-info-center-case">
                      <div
                        style="flex: 0 0 106px"
                        class="content-info-center-case-lable"
                      >
                        省病案对应科室
                      </div>
                      <el-select
                        style="width: 158px"
                        v-model="addform.ks_sba"
                        placeholder="请选择"
                      >
                        <el-option
                          v-for="(item, i) in columns[15].selectOption.data"
                          :key="i"
                          :label="item.label"
                          :value="item.value"
                        ></el-option>
                      </el-select>
                    </div>
                    <div class="content-info-center-case">
                      <div
                        style="flex: 0 0 130px"
                        class="content-info-center-case-lable"
                      >
                        库存扣减科室(西药)
                      </div>
                      <el-select
                        style="width: 134px"
                        v-model="addform.bm_qbjf"
                        placeholder="请选择"
                      >
                        <el-option
                          v-for="(item, i) in columns[6].selectOption.data"
                          :key="i"
                          :label="item.label"
                          :value="item.value"
                        ></el-option>
                      </el-select>
                    </div>
                    <div class="content-info-center-case">
                      <div
                        style="flex: 0 0 92px"
                        class="content-info-center-case-lable"
                      >
                        西药处方类型
                      </div>
                      <el-select
                        style="width: 172px"
                        v-model="addform.cffl_ks"
                        placeholder="请选择"
                      >
                        <el-option
                          v-for="(item, i) in columns[30].selectOption.data"
                          :key="i"
                          :label="item.label"
                          :value="item.value"
                        ></el-option>
                      </el-select>
                    </div>
                    <div class="content-info-center-case">
                      <div
                        style="flex: 0 0 130px"
                        class="content-info-center-case-lable"
                      >
                        库存扣减科室(中药)
                      </div>
                      <el-select
                        style="width: 134px"
                        v-model="addform.bm_qbjf_zy"
                        placeholder="请选择"
                      >
                        <el-option
                          v-for="(item, i) in columns[7].selectOption.data"
                          :key="i"
                          :label="item.label"
                          :value="item.value"
                        ></el-option>
                      </el-select>
                    </div>
                    <div class="content-info-center-case">
                      <div
                        style="flex: 0 0 92px"
                        class="content-info-center-case-lable"
                      >
                        中药处方类型
                      </div>
                      <el-select
                        style="width: 172px"
                        v-model="addform.cffl_ks_zy"
                        placeholder="请选择"
                      >
                        <el-option
                          v-for="(item, i) in columns[31].selectOption.data"
                          :key="i"
                          :label="item.label"
                          :value="item.value"
                        ></el-option>
                      </el-select>
                    </div>
                    <div class="content-info-center-case">
                      <div
                        style="flex: 0 0 92px"
                        class="content-info-center-case-lable"
                      >
                        临床医学类型
                      </div>
                      <el-select
                        style="width: 172px"
                        v-model="addform.lcyxlxdm"
                        placeholder="请选择"
                      >
                        <el-option
                          v-for="(item, i) in columns[29].selectOption.data"
                          :key="i"
                          :label="item.label"
                          :value="item.value"
                        ></el-option>
                      </el-select>
                    </div>
                    <div class="content-info-center-case">
                      <div
                        style="flex: 0 0 120px"
                        class="content-info-center-case-lable"
                      >
                        门诊材料扣减标志
                      </div>
                      <el-select
                        style="width: 144px"
                        v-model="addform.sf_mzclk"
                        placeholder="请选择"
                      >
                        <el-option
                          v-for="(item, i) in columns[18].selectOption.data"
                          :key="i"
                          :label="item.label"
                          :value="item.value"
                        ></el-option>
                      </el-select>
                    </div>
                    <div class="content-info-center-case">
                      <div
                        style="flex: 0 0 92px"
                        class="content-info-center-case-lable"
                      >
                        是否执行科室
                      </div>
                      <el-radio v-model="addform.zxbmbm_sfsy" label="0"
                        >是</el-radio
                      >
                      <el-radio v-model="addform.zxbmbm_sfsy" label="1"
                        >不显示</el-radio
                      >
                    </div>
                    <div class="content-info-center-case">
                      <div
                        style="flex: 0 0 122px"
                        class="content-info-center-case-lable"
                      >
                        报表是否必须显示
                      </div>
                      <el-radio v-model="addform.sfgd" label="2">否</el-radio>
                      <el-radio v-model="addform.sfgd" label="1"
                        >不显示</el-radio
                      >
                    </div>
                    <div class="content-info-center-case">
                      <div class="content-info-center-case-lable">显示排序</div>
                      <el-input
                        v-model="addform.bbxh"
                        style="width: 200px"
                        type="number"
                        placeholder="请输入"
                      ></el-input>
                    </div>
                    <div class="content-info-center-case">
                      <div
                        style="flex: 0 0 92px"
                        class="content-info-center-case-lable"
                      >
                        微信显示序号
                      </div>
                      <el-input
                        v-model="addform.wx_xsxh"
                        style="width: 172px"
                        type="number"
                        placeholder="请输入"
                      ></el-input>
                    </div>
                    <div class="content-info-center-case">
                      <div
                        style="flex: 0 0 92px"
                        class="content-info-center-case-lable"
                      >
                        微信是否显示
                      </div>
                      <el-radio v-model="addform.wx_sfxs" label="1"
                        >是</el-radio
                      >
                      <el-radio v-model="addform.wx_sfxs" label="0"
                        >否</el-radio
                      >
                    </div>
                    <div class="content-info-center-case">
                      <div class="content-info-center-case-lable">院区</div>
                      <el-select
                        style="width: 200px"
                        v-model="addform.xdyy_pqqf"
                        placeholder="请选择"
                      >
                        <el-option
                          v-for="(item, i) in columns[37].selectOption.data"
                          :key="i"
                          :label="item.label"
                          :value="item.value"
                        ></el-option>
                      </el-select>
                    </div>
                    <div class="content-info-center-case">
                      <div class="content-info-center-case-lable">药品大类</div>
                      <el-select
                        style="width: 200px"
                        v-model="addform.ypdl"
                        placeholder="请选择"
                      >
                        <el-option
                          v-for="(item, i) in columns[5].selectOption.data"
                          :key="i"
                          :label="item.label"
                          :value="item.value"
                        ></el-option>
                      </el-select>
                    </div>
                    <div class="content-info-center-case">
                      <div
                        style="flex: 0 0 120px"
                        class="content-info-center-case-lable"
                      >
                        开单执行科室标识
                      </div>
                      <el-select
                        style="width: 144px"
                        v-model="addform.kdzxks"
                        placeholder="请选择"
                      >
                        <el-option
                          v-for="(item, i) in columns[36].selectOption.data"
                          :key="i"
                          :label="item.label"
                          :value="item.value"
                        ></el-option>
                      </el-select>
                    </div>
                    <div class="content-info-center-case">
                      <div
                        style="flex: 0 0 120px"
                        class="content-info-center-case-lable"
                      >
                        门诊材料扣减科室
                      </div>
                      <el-select
                        style="width: 144px"
                        v-model="addform.bm_cljfkj_mz"
                        placeholder="请选择"
                      >
                        <el-option
                          v-for="(item, i) in columns[38].selectOption.data"
                          :key="i"
                          :label="item.mc"
                          :value="item.bh"
                        ></el-option>
                      </el-select>
                    </div>
                    <div class="content-info-center-case">
                      <div
                        style="flex: 0 0 120px"
                        class="content-info-center-case-lable"
                      >
                        住院材料扣减科室
                      </div>
                      <el-select
                        style="width: 144px"
                        v-model="addform.bm_cljfkj_zy"
                        placeholder="请选择"
                      >
                        <el-option
                          v-for="(item, i) in columns[39].selectOption.data"
                          :key="i"
                          :label="item.mc"
                          :value="item.bh"
                        ></el-option>
                      </el-select>
                    </div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script setup name="PersonnelForm">
import { TinySplit } from "@opentiny/vue";
import { ElMessage, ElMessageBox } from "element-plus";
import { ref, onMounted } from "vue";
import { Search } from "@element-plus/icons-vue";
const tabsArr = ["全部", "基本信息", "扩展信息"];
const container = ref(null);
const stateActive = ref(0);
const alls = ref(null);
const infos = ref(null);
const yibaoinfos = ref(null);
const others = ref(null);
const form = ref({
  vbmbj: "",
  vbmmc: "",
  vsyzt: "1",
});
const vbmbjArr = ref([]);
const activeName = ref("all");
const addform = ref({
  Newbh: "",
  ReContent: { Key: 0, Value: null },
  bbxh: null,
  bh: "",
  bj: "",
  bm_cljfkj_mz: "",
  bm_cljfkj_zy: "",
  bm_qbjf: null,
  bm_qbjf_zy: null,
  cffl_ks: "",
  cffl_ks_zy: "",
  je: 0,
  jnpt_bmbm: null,
  kdzxks: "",
  ks_clrq: null,
  ks_sba: null,
  kswz: "",
  lcyxlxdm: "",
  mc: "",
  rybm: "",
  saveflag: 1,
  sf_mzclk: "",
  sfgd: null,
  sjkfcws: null,
  sxjssj: null,
  sxkssj: null,
  syzt: "1",
  wd_bz: null,
  wd_ksjj: null,
  wd_lxdh: null,
  wd_sjksdm: null,
  wd_wubi: null,
  wd_xxdz: null,
  wd_yllx: null,
  wd_ztbgrq: null,
  wd_ztbgyy: null,
  wsjksbh: null,
  wsjksm: null,
  wx_sfxs: 0,
  wx_xsxh: 1,
  xdyy_pqqf: "",
  xgrq: "",
  yke414: null,
  yke416: "",
  yke417: null,
  ypdl: null,
  zxbmbm_pyjm: "",
  zxbmbm_sfsy: null,
  zxy_sf: null,
  _X_ROW_KEY: "",
});
const pageNo = reactive({
  total: 0,
  currentPage: 1,
  pageSize: 10,
});
const loading = ref(false);
const xinpuGrid = ref(null);
const tableHeight = ref(0);
const tableWidth = ref(0);
const bmbmArr = ref([]);
const contraTop = ref(null);
const options = ref([[{ code: "myBtn", name: "列调整" }]]);
const columns = ref([
  { type: "checkbox", width: 48 },
  { field: "bh", title: "编码", width: 60, editRender: { name: "input" } },
  {
    field: "mc",
    width: 120,
    title: "部门名称",
    editRender: { name: "input" },
  },
  {
    field: "bj",
    title: "部门标记",
    width: 120,
    editRender: {},
    selectName: "selectTable",
    selectOption: {
      fields: [
        {
          prop: "value",
          label: "代码",
          width: 100,
        },
        {
          prop: "label",
          label: "名称",
          width: 200,
        },
      ],
      data: [],
      objKey: "value",
      label: "label",
    },
  },
  {
    field: "syzt",
    title: "状态",
    width: 85,
    editRender: {},
    selectName: "selectTable",
    selectOption: {
      fields: [
        {
          prop: "dm",
          label: "代码",
          width: 100,
        },
        {
          prop: "mc",
          label: "名称",
          width: 200,
        },
      ],
      data: [
        {
          dm: 1,
          mc: "正常",
        },
        {
          dm: 2,
          mc: "停用",
        },
        {
          dm: 3,
          mc: "申请中",
        },
      ],
      objKey: "dm",
      label: "mc",
    },
  },
  {
    field: "ypdl",
    title: "药品大类",
    width: 100,
    editRender: {},
    selectName: "selectTable",
    selectOption: {
      fields: [
        {
          prop: "value",
          label: "代码",
          width: 100,
        },
        {
          prop: "label",
          label: "名称",
          width: 200,
        },
      ],
      data: [],
      objKey: "value",
      label: "label",
    },
  },
  {
    field: "bm_qbjf",
    title: "库房扣减科室(西药)",
    width: 150,
    editRender: {},
    selectName: "selectTable",
    selectOption: {
      fields: [
        {
          prop: "value",
          label: "代码",
          width: 100,
        },
        {
          prop: "label",
          label: "名称",
          width: 200,
        },
      ],
      data: [],
      objKey: "value",
      label: "label",
    },
  },
  {
    field: "bm_qbjf_zy",
    title: "库房扣减科室(中药)",
    width: 150,
    editRender: {},
    selectName: "selectTable",
    selectOption: {
      fields: [
        {
          prop: "value",
          label: "代码",
          width: 100,
        },
        {
          prop: "label",
          label: "名称",
          width: 200,
        },
      ],
      data: [],
      objKey: "value",
      label: "label",
    },
  },
  {
    field: "yke414",
    title: "科室病区",
    width: 100,
    editRender: {},
    selectName: "selectTable",
    selectOption: {
      fields: [
        {
          prop: "value",
          label: "代码",
          width: 100,
        },
        {
          prop: "label",
          label: "名称",
          width: 200,
        },
      ],
      data: [],
      objKey: "value",
      label: "label",
    },
  },
  {
    field: "yke416",
    width: 100,
    title: "科室负责人",
    editRender: { name: "input" },
  },
  {
    field: "ks_clrq",
    width: 120,
    title: "科室成立日期",
    editRender: {},
    selectName: "dataSelect",
  },
  {
    field: "yke417",
    width: 100,
    title: "总床位数",
    editRender: { name: "input" },
  },
  {
    field: "sjkfcws",
    width: 120,
    title: "实际开发床位数",
    editRender: { name: "input" },
  },
  {
    field: "zxbmbm_pyjm",
    width: 60,
    title: "简码",
    editRender: { name: "input" },
  },
  {
    field: "zxy_sf",
    title: "西医或中医病案",
    width: 120,
    editRender: {},
    selectName: "selectTable",
    selectOption: {
      fields: [
        {
          prop: "value",
          label: "代码",
          width: 100,
        },
        {
          prop: "label",
          label: "名称",
          width: 200,
        },
      ],
      data: [],
      objKey: "value",
      label: "label",
    },
  },
  {
    field: "ks_sba",
    title: "省病案",
    width: 80,
    editRender: {},
    selectName: "selectTable",
    selectOption: {
      fields: [
        {
          prop: "value",
          label: "代码",
          width: 100,
        },
        {
          prop: "label",
          label: "名称",
          width: 200,
        },
      ],
      data: [],
      objKey: "value",
      label: "label",
    },
  },
  {
    field: "sfgd",
    title: "报表是否显示",
    width: 120,
    editRender: {},
    selectName: "selectTable",
    selectOption: {
      fields: [
        {
          prop: "value",
          label: "代码",
          width: 100,
        },
        {
          prop: "label",
          label: "名称",
          width: 200,
        },
      ],
      data: [],
      objKey: "value",
      label: "label",
    },
  },
  {
    field: "bbxh",
    width: 120,
    title: "报表显示顺序",
    editRender: { name: "input" },
  },
  {
    field: "sf_mzclk",
    title: "门诊材料扣减标志",
    width: 150,
    editRender: {},
    selectName: "selectTable",
    selectOption: {
      fields: [
        {
          prop: "value",
          label: "代码",
          width: 100,
        },
        {
          prop: "label",
          label: "名称",
          width: 200,
        },
      ],
      data: [],
      objKey: "value",
      label: "label",
    },
  },
  {
    field: "zxbmbm_sfsy",
    title: "是否执行科室",
    width: 120,
    editRender: {},
    selectName: "selectTable",
    selectOption: {
      fields: [
        {
          prop: "value",
          label: "代码",
          width: 100,
        },
        {
          prop: "label",
          label: "名称",
          width: 200,
        },
      ],
      data: [],
      objKey: "value",
      label: "label",
    },
  },
  {
    field: "wd_lxdh",
    width: 100,
    title: "联系电话",
    editRender: { name: "input" },
  },
  {
    field: "je",
    width: 160,
    title: "病人最高欠费金额",
    editRender: { name: "input" },
  },
  {
    field: "jnpt_bmbm",
    title: "平台对照科室",
    width: 120,
    editRender: {},
    selectName: "selectTable",
    selectOption: {
      fields: [
        {
          prop: "value",
          label: "代码",
          width: 100,
        },
        {
          prop: "label",
          label: "名称",
          width: 200,
        },
      ],
      data: [],
      objKey: "value",
      label: "label",
    },
  },
  {
    field: "sxkssj",
    width: 120,
    title: "生效开始时间",
    editRender: {},
    selectName: "dataSelect",
  },
  {
    field: "sxjssj",
    width: 120,
    title: "生效结束时间",
    editRender: {},
    selectName: "dataSelect",
  },
  {
    field: "kswz",
    width: 100,
    title: "科室位置",
    editRender: { name: "input" },
  },
  {
    field: "wd_xxdz",
    width: 100,
    title: "详细地址",
    editRender: { name: "input" },
  },
  {
    field: "wd_ksjj",
    width: 100,
    title: "科室简介",
    editRender: { name: "input" },
  },
  {
    field: "Newbh",
    width: 100,
    title: "HIS编码",
    editRender: { name: "input" },
  },
  {
    field: "lcyxlxdm",
    title: "临床医学类型",
    width: 120,
    editRender: {},
    selectName: "selectTable",
    selectOption: {
      fields: [
        {
          prop: "value",
          label: "代码",
          width: 100,
        },
        {
          prop: "label",
          label: "名称",
          width: 200,
        },
      ],
      data: [],
      objKey: "value",
      label: "label",
    },
  },
  {
    field: "cffl_ks",
    title: "西药处方类型",
    width: 120,
    editRender: {},
    selectName: "selectTable",
    selectOption: {
      fields: [
        {
          prop: "value",
          label: "代码",
          width: 100,
        },
        {
          prop: "label",
          label: "名称",
          width: 200,
        },
      ],
      data: [],
      objKey: "value",
      label: "label",
    },
  },
  {
    field: "cffl_ks_zy",
    title: "中药处方类型",
    width: 120,
    editRender: {},
    selectName: "selectTable",
    selectOption: {
      fields: [
        {
          prop: "value",
          label: "代码",
          width: 100,
        },
        {
          prop: "label",
          label: "名称",
          width: 200,
        },
      ],
      data: [],
      objKey: "value",
      label: "label",
    },
  },
  {
    field: "rybm",
    title: "修改人",
    width: 100,
    editRender: {},
    selectName: "selectTable",
    selectOption: {
      fields: [
        {
          prop: "value",
          label: "代码",
          width: 100,
        },
        {
          prop: "label",
          label: "名称",
          width: 200,
        },
      ],
      data: [],
      objKey: "value",
      label: "label",
    },
  },
  {
    field: "xgrq",
    width: 100,
    title: "修改日期",
    editRender: {},
    selectName: "dataSelect",
  },
  {
    field: "wx_xsxh",
    width: 120,
    title: "微信显示序号",
    editRender: { name: "input" },
  },
  {
    field: "wx_sfxs",
    title: "微信是否显示",
    width: 120,
    editRender: {},
    selectName: "selectTable",
    selectOption: {
      fields: [
        {
          prop: "value",
          label: "代码",
          width: 100,
        },
        {
          prop: "label",
          label: "名称",
          width: 200,
        },
      ],
      data: [],
      objKey: "value",
      label: "label",
    },
  },
  {
    field: "kdzxks",
    title: "开单执行科室标识",
    width: 160,
    editRender: {},
    selectName: "selectTable",
    selectOption: {
      fields: [
        {
          prop: "value",
          label: "代码",
          width: 100,
        },
        {
          prop: "label",
          label: "名称",
          width: 200,
        },
      ],
      data: [],
      objKey: "value",
      label: "label",
    },
  },
  {
    field: "xdyy_pqqf",
    title: "院区",
    width: 60,
    editRender: {},
    selectName: "selectTable",
    selectOption: {
      fields: [
        {
          prop: "value",
          label: "代码",
          width: 100,
        },
        {
          prop: "label",
          label: "名称",
          width: 200,
        },
      ],
      data: [
        {
          label: "院区1",
          value: "1",
        },
        // {
        //   dm:'院区2',
        //   mc:'2'
        // }
      ],
      objKey: "value",
      label: "label",
    },
  },
  {
    field: "bm_cljfkj_mz",
    title: "门诊材料扣减科室",
    width: 160,
    editRender: {},
    selectName: "selectTable",
    selectOption: {
      fields: [
        {
          prop: "bh",
          label: "代码",
          width: 100,
        },
        {
          prop: "mc",
          label: "名称",
          width: 200,
        },
      ],
      data: [],
      objKey: "bh",
      label: "mc",
    },
  },
  {
    field: "bm_cljfkj_zy",
    title: "住院材料扣减科室",
    width: 160,
    editRender: {},
    selectName: "selectTable",
    selectOption: {
      fields: [
        {
          prop: "bh",
          label: "代码",
          width: 100,
        },
        {
          prop: "mc",
          label: "名称",
          width: 200,
        },
      ],
      data: [],
      objKey: "bh",
      label: "mc",
    },
  },
  {
    field: "vxeActive",
    title: "操作",
    fixed: "right",
    width: 90,
    selectOption: ["详情", "删除"],
  },
]);
const data = ref([]);
const detailShow = ref(false);
const tsbsActive = ref(0);
const vxeActiveClick = (name, row) => {
  if (name == "详情") {
    addform.value = row;
    detailShow.value = true;
    dragControllerDiv();
  } else if (name == "删除") {
    ElMessageBox.confirm("此操作将永久删除该数据, 是否继续?", "提示", {
      confirmButtonText: "确定",
      cancelButtonText: "取消",
      type: "warning",
    })
      .then(async () => {
        if (row.saveflag == 1) {
          data.value.forEach((v, j) => {
            if (row._X_ROW_KEY == v._X_ROW_KEY) {
              data.value.splice(j, 1);
            }
          });
          ElMessage({
            message: "删除成功",
            type: "success",
          });
        } else {
          row.saveflag = 3;
          const res = await window.xinpuHttpApi("102002", { list: [row] });
          if (res && res.Flag) {
            ElMessage({
              message: "删除成功",
              type: "success",
            });
            getData();
          }
        }
      })
      .catch(() => {});
  }
};
const tabsClick = (i) => {
  tsbsActive.value = i;
};
const detailShowCloseClick = () => {
  detailShow.value = false;
  let left = document.getElementsByClassName("xinban-pai-left");
  left[0].style = "";
};
const dragControllerDiv = function () {
  let resize = document.getElementsByClassName("resize");
  let left = document.getElementsByClassName("xinban-pai-left-active");
  let mid = document.getElementsByClassName("xinban-pai-right");
  let box = document.getElementsByClassName("xinban-pai");
  for (let i = 0; i < resize.length; i++) {
    // 鼠标按下事件
    resize[i].onmousedown = function (e) {
      let startX = e.clientX - 207;
      // 鼠标拖动事件
      document.onmousemove = function (e) {
        resize[i].left = startX;
        let endX = e.clientX - 207;
        let moveLen = resize[i].left + (endX - startX); // （endx-startx）=移动的距离。resize[i].left+移动的距离=左边区域最后的宽度
        let maxT = box[i].clientWidth - resize[i].offsetWidth; // 容器宽度 - 左边区域的宽度 = 右边区域的宽度
        if (moveLen < 500) moveLen = 500; // 左边区域的最小宽度为32px
        if (moveLen > maxT - 500) moveLen = maxT - 500; //右边区域最小宽度为150px
        resize[i].style.left = moveLen; // 设置左侧区域的宽度
        for (let j = 0; j < left.length; j++) {
          left[j].style.width =
            (moveLen / (document.body.clientWidth - 207)) * 100 + "%";
          mid[j].style.width =
            ((box[i].clientWidth - moveLen) /
              (document.body.clientWidth - 207)) *
              100 +
            2 +
            "%";
        }
      };
      // 鼠标松开事件
      document.onmouseup = function (evt) {
        //颜色恢复
        document.onmousemove = null;
        document.onmouseup = null;
        resize[i].releaseCapture && resize[i].releaseCapture(); //当你不在需要继续获得鼠标消息就要应该调用ReleaseCapture()释放掉
      };
      resize[i].setCapture && resize[i].setCapture(); //该函数在属于当前线程的指定窗口里设置鼠标捕获
      return false;
    };
  }
};
// 新增数据
const addData = () => {
  data.value.push({
    Newbh: "",
    ReContent: { Key: 0, Value: null },
    bbxh: null,
    bh: "",
    bj: "",
    bm_cljfkj_mz: "",
    bm_cljfkj_zy: "",
    bm_qbjf: null,
    bm_qbjf_zy: null,
    cffl_ks: "",
    cffl_ks_zy: "",
    je: 0,
    jnpt_bmbm: null,
    kdzxks: "",
    ks_clrq: null,
    ks_sba: null,
    kswz: "",
    lcyxlxdm: "",
    mc: "",
    rybm: "",
    saveflag: 1,
    sf_mzclk: "",
    sfgd: null,
    sjkfcws: null,
    sxjssj: null,
    sxkssj: null,
    syzt: "1",
    wd_bz: null,
    wd_ksjj: null,
    wd_lxdh: null,
    wd_sjksdm: null,
    wd_wubi: null,
    wd_xxdz: null,
    wd_yllx: null,
    wd_ztbgrq: null,
    wd_ztbgyy: null,
    wsjksbh: null,
    wsjksm: null,
    wx_sfxs: 0,
    wx_xsxh: 1,
    xdyy_pqqf: "",
    xgrq: "",
    yke414: null,
    yke416: "",
    yke417: null,
    ypdl: null,
    zxbmbm_pyjm: "",
    zxbmbm_sfsy: null,
    zxy_sf: null,
    _X_ROW_KEY: "",
  });
};
// 删除数据
const deleteClick = async () => {
  const arr = xinpuGrid.value.removeTable();
  console.log(arr);
  if (arr && arr.length > 0) {
    let result = [];
    arr.forEach((item) => {
      if (item.saveflag == 1) {
        data.value.forEach((v, j) => {
          if (item._X_ROW_KEY == v._X_ROW_KEY) {
            data.value.splice(j, 1);
          }
        });
      } else {
        item.saveflag = 3;
        result.push(item);
      }
    });
    if (result.length > 0) {
      const res = await window.xinpuHttpApi("102002", { list: arr });
      if (res && res.Flag) {
        ElMessage({
          message: "删除成功",
          type: "success",
        });
        getData();
      }
    } else {
      ElMessage({
        message: "删除成功",
        type: "success",
      });
    }
  } else {
    ElMessage({
      message: "请选择要删除的数据",
      type: "warning",
    });
  }
};
// 保存数据
const saveClick = async () => {
  const arr = xinpuGrid.value.getEditData();
  console.log(arr);
  if (arr && arr.length > 0) {
    arr.forEach((item) => {
      if (item.saveflag !== 1) {
        item.saveflag = 2;
      }
    });
    const res = await window.xinpuHttpApi("102002", { list: arr });
    if (res && res.Flag) {
      ElMessage({
        message: "保存成功",
        type: "success",
      });
      getData();
    }
  } else {
    ElMessage({
      message: "当前没有要保存和新增的数据",
      type: "warning",
    });
  }
};
// 点击详情接口
const detailClick = () => {
  const item = xinpuGrid.value.getCurrentEvent();
  console.log(item);
  if (item) {
    addform.value = item;
    detailShow.value = true;
    dragControllerDiv();
  } else {
    ElMessage({
      message: "请选择要看详情的数据",
      type: "warning",
    });
  }
};
// 点击详情里的保存按钮
const detailSaveClick = async () => {
  if (addform.value.saveflag !== 1) {
    addform.value.saveflag = 2;
  }
  const res = await window.xinpuHttpApi("102002", { list: [addform.value] });
  console.log(res);
  if (res && res.Flag) {
    detailShow.value = false;
    ElMessage({
      message: "保存成功",
      type: "success",
    });
    getData();
  }
};
const gettableHeight = () => {
  // 这里是屏幕大小变化时需要执行的逻辑
  let screenheight = document.body.clientHeight;
  let screenWidth = document.body.clientWidth - 248;
  console.log(screenheight, screenWidth);
  screenheight = screenheight - contraTop.value.offsetHeight - 188;
  tableHeight.value = screenheight;
  tableWidth.value = screenWidth;
  console.log(tableHeight.value, tableWidth.value);
};
const handleClick = (tab, event) => {
  if (tab && tab.props && tab.props.name) {
    activeName.value = tab.props.name;
    if (tab.props.name == "all") {
      const element = document.getElementById("infos");
      if (element) {
        element.scrollIntoView({ behavior: "smooth" });
      }
    } else {
      const element = document.getElementById(tab.props.name + "s");
      console.log(element);
      if (element) {
        element.scrollIntoView({ behavior: "smooth" });
      }
    }
  }
};
const stateClick = (data) => {
  stateActive.value = data;
};
const handleAvatarSuccess = (data) => {
  console.log(data);
};
const beforeAvatarUpload = (file) => {
  console.log(file);
};
const getData = async () => {
  loading.value = true;
  const res = await window.xinpuHttpApi("102001", form.value);
  console.log(res);
  if (res && res.Flag) {
    data.value = res.ReContent;
  }
  loading.value = false;
};

// 获取部门标记
const getbmbj = async () => {
  const res = await window.xinpuWebsApi("GetFixCode", { bh: "xp_bm_006" });
  if (res && res.Flag) {
    vbmbjArr.value = res.ReContent;
    columns.value.forEach((v) => {
      if (v.field == "bj") {
        v.selectOption.data = res.ReContent;
      }
    });
  }
};

// 获取药品大类
const getypdl = async () => {
  const res = await window.xinpuWebsApi("GetFixCode", { bh: "xp_yp_006" });
  if (res && res.Flag) {
    columns.value.forEach((v) => {
      if (v.field == "ypdl") {
        v.selectOption.data = res.ReContent;
      }
    });
  }
};
// 获取西药库存扣减科室
const getKckjks = async () => {
  const res = await window.xinpuWebsApi("GetFixCode", { bh: "xp_010" });
  if (res && res.Flag) {
    columns.value.forEach((v) => {
      if (v.field == "bm_qbjf") {
        v.selectOption.data = res.ReContent;
      }
    });
  }
};
// 获取中药库存扣减科室
const getzyKckjks = async () => {
  const res = await window.xinpuWebsApi("GetFixCode", { bh: "xp_011" });
  if (res && res.Flag) {
    columns.value.forEach((v) => {
      if (v.field == "bm_qbjf_zy") {
        v.selectOption.data = res.ReContent;
      }
    });
  }
};
// 获取科室病区
const getksbqData = async () => {
  const res = await window.xinpuWebsApi("GetFixCode", { bh: "v_yh_yke414" });
  if (res && res.Flag) {
    columns.value.forEach((v) => {
      if (v.field == "yke414") {
        v.selectOption.data = res.ReContent;
      }
    });
  }
};
// 获取西医或中医病案
const getbaData = async () => {
  const res = await window.xinpuWebsApi("GetFixCode", { bh: "xp_012" });
  if (res && res.Flag) {
    columns.value.forEach((v) => {
      if (v.field == "zxy_sf") {
        v.selectOption.data = res.ReContent;
      }
    });
  }
};
// 获取省病案
const getsbaData = async () => {
  const res = await window.xinpuWebsApi("GetFixCode", { bh: "xp_sba_dep" });
  if (res && res.Flag) {
    columns.value.forEach((v) => {
      if (v.field == "ks_sba") {
        v.selectOption.data = res.ReContent;
      }
    });
  }
};
// 获取报表是否显示
const getsfgdData = async () => {
  const res = await window.xinpuWebsApi("GetFixCode", { bh: "xp_014" });
  if (res && res.Flag) {
    columns.value.forEach((v) => {
      if (v.field == "sfgd") {
        v.selectOption.data = res.ReContent;
      }
    });
  }
};
// 获取门诊材料扣减标志
const getkjbzData = async () => {
  const res = await window.xinpuWebsApi("GetFixCode", { bh: "xp_015" });
  if (res && res.Flag) {
    columns.value.forEach((v) => {
      if (v.field == "sf_mzclk") {
        v.selectOption.data = res.ReContent;
      }
    });
  }
};

// 获取是否执行科室
const getzxbmbm_sfsyData = async () => {
  const res = await window.xinpuWebsApi("GetFixCode", { bh: "xp_013" });
  if (res && res.Flag) {
    columns.value.forEach((v) => {
      if (v.field == "zxbmbm_sfsy") {
        v.selectOption.data = res.ReContent;
      }
    });
  }
};

// 获取平台对照科室
const getjnpt_bmbmData = async () => {
  const res = await window.xinpuWebsApi("GetFixCode", { bh: "xp_bm_gbks" });
  if (res && res.Flag) {
    columns.value.forEach((v) => {
      if (v.field == "jnpt_bmbm") {
        v.selectOption.data = res.ReContent;
      }
    });
  }
};

// 获取临床医学类型
const getlcyxlxdmData = async () => {
  const res = await window.xinpuWebsApi("GetSymbCode", { bh: "CV0015" });
  if (res && res.Flag) {
    columns.value.forEach((v) => {
      if (v.field == "lcyxlxdm") {
        v.selectOption.data = res.ReContent;
      }
    });
  }
};

// 获取西医处方类型
const getcffl_ksData = async () => {
  const res = await window.xinpuWebsApi("GetFixCode", { bh: "xp_sy_xycflx" });
  console.log(res);
  if (res && res.Flag) {
    columns.value.forEach((v) => {
      if (v.field == "cffl_ks") {
        v.selectOption.data = res.ReContent;
      }
    });
  }
};
// 获取中医处方类型
const getcffl_ks_zyData = async () => {
  const res = await window.xinpuWebsApi("GetFixCode", { bh: "xp_sy_zycflx" });
  console.log(res);
  if (res && res.Flag) {
    columns.value.forEach((v) => {
      if (v.field == "cffl_ks_zy") {
        v.selectOption.data = res.ReContent;
      }
    });
  }
};
// 获取修改人数据
const getrybmData = async () => {
  const res = await window.xinpuWebsApi("GetFixCode", { bh: "xp_ry_001" });
  if (res && res.Flag) {
    columns.value.forEach((v) => {
      if (v.field == "rybm") {
        v.selectOption.data = res.ReContent;
      }
    });
  }
};

// 微信是否显示
const getwx_sfxsData = async () => {
  const res = await window.xinpuWebsApi("GetFixCode", { bh: "xp_008" });
  if (res && res.Flag) {
    columns.value.forEach((v) => {
      if (v.field == "wx_sfxs") {
        v.selectOption.data = res.ReContent;
      }
    });
  }
};

// 获取开单执行科室标识
const getkdzxksData = async () => {
  const res = await window.xinpuWebsApi("GetFixCode", { bh: "xp_kdzxks" });
  if (res && res.Flag) {
    columns.value.forEach((v) => {
      if (v.field == "kdzxks") {
        v.selectOption.data = res.ReContent;
      }
    });
  }
};

// 获取门诊材料扣减科室和住院材料扣减科室
const getkjksData = async () => {
  const res = await window.xinpuHttpApi("102001", {});
  if (res && res.Flag) {
    columns.value.forEach((v) => {
      if (v.field == "bm_cljfkj_mz" || v.field == "bm_cljfkj_zy") {
        v.selectOption.data = res.ReContent;
      }
    });
  }
};

// 下拉框需要修改的数据
const updataSelect = (val, column) => {
  if (column.column && column.column.field == "bj") {
    let resultIndex = columns.value[column.columnIndex].field;
    console.log(val, data.value[column.rowIndex][resultIndex]);
    data.value[column.rowIndex][resultIndex] = val.value;
  }
  if (column.column && column.column.field == "ypdl") {
    let resultIndex = columns.value[column.columnIndex].field;
    console.log(val, data.value[column.rowIndex][resultIndex]);
    data.value[column.rowIndex][resultIndex] = val.value;
  }
  if (column.column && column.column.field == "bm_qbjf") {
    let resultIndex = columns.value[column.columnIndex].field;
    console.log(val, data.value[column.rowIndex][resultIndex]);
    data.value[column.rowIndex][resultIndex] = val.value;
  }
  if (column.column && column.column.field == "bm_qbjf_zy") {
    let resultIndex = columns.value[column.columnIndex].field;
    console.log(val, data.value[column.rowIndex][resultIndex]);
    data.value[column.rowIndex][resultIndex] = val.value;
  }
  if (column.column && column.column.field == "zxy_sf") {
    let resultIndex = columns.value[column.columnIndex].field;
    console.log(val, data.value[column.rowIndex][resultIndex]);
    data.value[column.rowIndex][resultIndex] = val.value;
  }
  if (column.column && column.column.field == "ks_sba") {
    let resultIndex = columns.value[column.columnIndex].field;
    console.log(val, data.value[column.rowIndex][resultIndex]);
    data.value[column.rowIndex][resultIndex] = val.value;
  }
  if (column.column && column.column.field == "sfgd") {
    let resultIndex = columns.value[column.columnIndex].field;
    console.log(val, data.value[column.rowIndex][resultIndex]);
    data.value[column.rowIndex][resultIndex] = val.value;
  }
  if (column.column && column.column.field == "sf_mzclk") {
    let resultIndex = columns.value[column.columnIndex].field;
    console.log(val, data.value[column.rowIndex][resultIndex]);
    data.value[column.rowIndex][resultIndex] = val.value;
  }
  if (column.column && column.column.field == "zxbmbm_sfsy") {
    let resultIndex = columns.value[column.columnIndex].field;
    console.log(val, data.value[column.rowIndex][resultIndex]);
    data.value[column.rowIndex][resultIndex] = val.value;
  }
  if (column.column && column.column.field == "lcyxlxdm") {
    let resultIndex = columns.value[column.columnIndex].field;
    console.log(val, data.value[column.rowIndex][resultIndex]);
    data.value[column.rowIndex][resultIndex] = val.value;
  }
  if (column.column && column.column.field == "cffl_ks") {
    let resultIndex = columns.value[column.columnIndex].field;
    console.log(val, data.value[column.rowIndex][resultIndex]);
    data.value[column.rowIndex][resultIndex] = val.value;
  }
  if (column.column && column.column.field == "cffl_ks_zy") {
    let resultIndex = columns.value[column.columnIndex].field;
    console.log(val, data.value[column.rowIndex][resultIndex]);
    data.value[column.rowIndex][resultIndex] = val.value;
  }
  if (column.column && column.column.field == "wx_sfxs") {
    let resultIndex = columns.value[column.columnIndex].field;
    console.log(val, data.value[column.rowIndex][resultIndex]);
    data.value[column.rowIndex][resultIndex] = val.value;
  }
  if (column.column && column.column.field == "kdzxks") {
    let resultIndex = columns.value[column.columnIndex].field;
    console.log(val, data.value[column.rowIndex][resultIndex]);
    data.value[column.rowIndex][resultIndex] = val.value;
  }
  if (column.column && column.column.field == "xdyy_pqqf") {
    let resultIndex = columns.value[column.columnIndex].field;
    console.log(val, data.value[column.rowIndex][resultIndex]);
    data.value[column.rowIndex][resultIndex] = val.value;
  }
  if (column.column && column.column.field == "bm_cljfkj_mz") {
    let resultIndex = columns.value[column.columnIndex].field;
    console.log(val, data.value[column.rowIndex][resultIndex]);
    data.value[column.rowIndex][resultIndex] = val.bh;
  }
  if (column.column && column.column.field == "bm_cljfkj_zy") {
    let resultIndex = columns.value[column.columnIndex].field;
    console.log(val, data.value[column.rowIndex][resultIndex]);
    data.value[column.rowIndex][resultIndex] = val.bh;
  }
  if (column.column && column.column.field == "syzt") {
    let resultIndex = columns.value[column.columnIndex].field;
    console.log(val, data.value[column.rowIndex][resultIndex]);
    data.value[column.rowIndex][resultIndex] = val.dm;
  }
};

// 下拉选择框修改的数据
const selectCheckedChange = (val, column) => {};

const searchClick = () => {
  getData();
};
onMounted(async () => {
  gettableHeight();
  getData();
  getbmbj();
  getypdl();
  getKckjks();
  getzyKckjks();
  getksbqData();
  getbaData();
  getsbaData();
  getsfgdData();
  getkjbzData();
  getzxbmbm_sfsyData();
  getjnpt_bmbmData();
  getlcyxlxdmData();
  getcffl_ksData();
  getcffl_ks_zyData();
  getrybmData();
  getwx_sfxsData();
  getkdzxksData();
  getkjksData();
});
</script>

<style lang="scss" scoped>
.xinban-pai {
  width: 100%;
  height: calc(100vh - 180px);
  display: flex;
  align-items: flex-start;
  .xinban-pai-left {
    width: 100%;
  }
  .xinban-pai-left-active {
    width: 64.5%;
  }
  .resize {
    cursor: col-resize;
    width: 1%;
    height: calc(100vh - 180px);
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .xinban-pai-right {
    width: 35.5%;
    height: calc(100vh - 180px);
    border-radius: 4px 4px 4px 4px;
    border: 1px solid #ebebeb;
    .admin-Drawer-top {
      height: 40px;
      width: 100%;
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 0 12px;
      box-sizing: border-box;
      background: #f7f7f7;
      font-size: 14px;
      color: #333333;
      border-bottom: 1px solid #ebebeb;
    }
    .admin-Drawer-bottoms {
      width: 100%;
      .admin-Drawer-bottoms-tab {
        padding: 6px 12px;
        box-sizing: border-box;
        display: flex;
        align-items: center;
        border-bottom: 1px dashed #ebebeb;
        cursor: pointer;
        .admin-Drawer-bottoms-tab-case {
          padding: 4px 12px;
          box-sizing: border-box;
          background: #ebebeb;
          border-radius: 4px 4px 4px 4px;
          margin-right: 12px;
          font-weight: 400;
          font-size: 14px;
          color: #999999;
        }
        .tabs-active {
          background: #359de1;
          color: #ffffff;
        }
      }
      .admin-Drawer-bottoms-btn {
        display: flex;
        align-items: center;
        padding: 12px;
        box-sizing: border-box;
        border-bottom: 1px dashed #ebebeb;
        .button-case-box {
          display: flex;
          align-items: center;
          margin-right: 12px;
          font-size: 14px;
          color: #333333;
          cursor: pointer;
        }
      }
      .content-tabs {
        width: 100%;
        height: calc(100vh - 308px);
        overflow-y: auto;
        padding: 12px 0 12px 12px;
        box-sizing: border-box;
        .content-line {
          width: 2px;
          height: 14px;
          background: #359de1;
          margin-right: 4px;
        }
        .content-info {
          width: 100%;
          .content-info-top {
            display: flex;
            align-items: center;
            font-weight: bold;
            font-size: 14px;
            color: #333333;
            margin-bottom: 16px;
          }
          .content-state {
            height: 32px;
            display: flex;
            align-items: center;
            .content-state-active {
              border: 1px solid #359de1 !important;
              color: #359de1 !important;
            }
            .content-state-one,
            .content-state-two,
            .content-state-three {
              border: 1px solid #ebebeb;
              display: flex;
              align-items: center;
              justify-content: center;
              font-size: 14px;
              color: #333333;
            }
            .content-state-one {
              width: 66px;
              height: 32px;
              border-radius: 4px 0px 0px 4px;
            }
            .content-state-two {
              width: 66px;
              height: 32px;
              border-right: 0;
              border-left: 0;
            }
            .content-state-three {
              width: 68px;
              height: 32px;
              border-radius: 0px 4px 4px 0px;
            }
          }
        }
        .content-yibaoinfo {
          width: 100%;
          .content-yibaoinfo-top {
            display: flex;
            align-items: center;
            font-weight: bold;
            font-size: 14px;
            color: #333333;
            margin-bottom: 16px;
          }
        }
        .content-other {
          width: 100%;
          height: 400px;
          .content-other-top {
            display: flex;
            align-items: center;
            font-weight: bold;
            font-size: 14px;
            color: #333333;
            margin-bottom: 16px;
          }
        }
        .content-info-center-cell {
          width: 100%;
          display: flex;
          align-items: center;
          flex-wrap: wrap;
          .content-info-center-case {
            width: 264px;
            display: flex;
            align-items: center;
            margin-right: 12px;
            margin-bottom: 12px;
            .content-info-center-case-lable {
              font-size: 14px;
              color: #333333;
              flex: 0 0 64px;
              text-align: right;
              padding-right: 8px;
              box-sizing: border-box;
            }
          }
          .content-info-center-case:last-child {
            margin-right: 0px;
          }
        }
      }
    }
  }
}
.admin-renyuan {
  padding: 8px;
  box-sizing: border-box;
  width: 100%;
  height: calc(100vh - 83px);
  background: #f7f7f7;
  .admin-renyuan-case {
    width: 100%;
    height: calc(100vh - 100px);
    background: #fff;
    padding: 12px;
    box-sizing: border-box;
    border-radius: 4px 4px 4px 4px;
  }
  .line {
    width: 100%;
    height: 1px;
    background: #ebebeb;
    margin: 12px 0;
  }
  .admin-top {
    display: flex;
    align-items: center;
    .admin-case-top {
      display: flex;
      align-items: center;
      margin-right: 8px;
    }
  }
  .button-case {
    display: flex;
    align-items: center;
    font-size: 14px;
    color: #333333;
    // margin-bottom: 16px;
    padding: 10px;
    box-sizing: border-box;
    border-top: 1px solid #ebebeb;
    border-left: 1px solid #ebebeb;
    border-right: 1px solid #ebebeb;
    border-radius: 4px 4px 0 0;
    .button-case-box {
      display: flex;
      align-items: center;
      margin-right: 12px;
      cursor: pointer;
    }
  }
}
.vxe-pageNo {
  padding-right: 16px;
  box-sizing: border-box;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  margin-top: 10px;
  // overflow: hidden;
}
.admin-Drawer {
  width: 864px;
  height: calc(100vh - 100px);
  background: #ffffff;
  box-shadow: -2px 4px 8px 0px rgba(0, 0, 0, 0.2);
  border-radius: 0px 0px 0px 0px;
  position: fixed;
  top: 100px;
  right: 0;
  z-index: 100;
  .admin-Drawer-bottom {
    width: 100%;
    height: 56px;
    position: absolute;
    bottom: 0;
    left: 0;
    border-top: 2px solid #ebebeb;
    background: #ffffff;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 12px;
    box-sizing: border-box;
  }
  .admin-Drawer-top {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px;
    box-sizing: border-box;
    font-size: 14px;
    color: #333333;
  }
  .admin-Drawer-bottoms {
    .admin-Drawer-bottoms-tab {
      padding: 6px 12px;
      box-sizing: border-box;
      display: flex;
      align-items: center;
      .admin-Drawer-bottoms-tab-case {
        padding: 4px 12px;
        box-sizing: border-box;
        background: #ebebeb;
        border-radius: 4px 4px 4px 4px;
      }
    }
  }
  .admin-Drawer-line {
    width: 100%;
    height: 1px;
    background: #ebebeb;
  }
  .admin-Drawer-content {
    width: 100%;
    height: calc(100vh - 155px);
    padding: 16px 0 16px 16px;
    box-sizing: border-box;
    .content-avatar {
      display: flex;
      align-items: center;
      font-size: 14px;
      color: #333333;
      font-weight: bold;
    }
  }
}

.avatar-uploader .avatar {
  width: 100px;
  height: 100px;
  display: block;
}
</style>
<style>
.avatar-uploader .el-upload {
  border: 1px solid #ebebeb;
  border-radius: 6px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  transition: var(--el-transition-duration-fast);
}

.avatar-uploader .el-upload:hover {
  border-color: #ebebeb;
}

.el-icon.avatar-uploader-icon {
  font-size: 24px;
  color: #8c939d;
  width: 100px;
  height: 100px;
  text-align: center;
}
</style>